You Don’t Need React!
You don’t need React. This isn’t a joke. I’m not trying to make you use another framework like Angular either. Angular is even bigger and you don’t need it either. The fact is you don’t need a framework at all. I’m just picking on React because it is the most popular and in my opinion has won the Front End library war of adoption. You can just write plain JavaScript. Before you click away please let me explain.
React came at a time when the web specifications were not as far as they are today. Creating your custom HTML tags in JavaScript was an idea largely founded by React and adopted by every framework under the sun. Even the Angular folks abandoned their MV* approach to adopt a component-based framework in Angular 2+. The idea was foundational to how the web is developed today. I love React too. I have a significant amount of development experience in it. I would even say it is the framework I am most proficient in. But I don’t know that we still need it today.
Today’s Web
Today’s web has Custom Elements under the Web Components specification. This allows a person to write a custom HTML element with JavaScript, HTML, and CSS. It also comes packaged with a way to register the element to the web page and has a method of encapsulating the element from side effects of the rest of the page’s JavaScript called the Shadow DOM.
Right now you may be shouting about how your app needs XYZ library and that React or your Framework of choice has great integration with it. To be honest, you probably don’t need that XYZ library either, but even if you do need it, you can still write your app without the React integration. I’m sure the Author wrote the library completely agnostic to that specialized integration.
JSX is so elegant though… I agree but you don’t need it though. Writing Components in React should’ve taught you to write your components very small and to encapsulate the JavaScript and styles from the rest of the page. If you follow these principles in Custom Element construction you also don’t need JSX. String literal construction works just fine most of the time.
You could make the jump to lit-element or Stenciljs because they at least compile to Native Web Components, but you don’t need those either. The overhead is less than React but is still not required.
Learn JavaScript Not a Framework
Collectively we need to learn how to write JavaScript, not another shiny framework. I’ve spent years chasing the Framework dragon. My journey took me from Polymer 0.5 -> RiotJS -> React -> Angular 2.0+ -> StencilJS -> VueJS. I can say that they all work. And they all miss the mark. Polymer just wasn’t there at the time. RiotJS never really gained a ton of traction. React oddly decided to break native Web Components by doing some weird synthetic event stuff. Angular 2.0+ will require you to learn how to fly a plane to use. StencilJS is cool but makes you want to write React instead. VueJS is great, but it still has its ecosystem and overhead associated with it. Each one of these frameworks requires a build system and tons of tooling which all take a ton of time to learn and set up. None of them work with each other either. What is the point of creating a component if that component can not be shared?
Native Custom Elements can work in any of those spaces (even React if you’re willing to do a bit of work). It requires no build system. You can use it in every modern browser. (Do not say IE11. IE is not modern and needs to die a painful death already). If you spend a little bit of time learning how to write JavaScript and use the new Web Components feature you can save yourself the hassle of learning another framework, all the build tools and prevent your website from becoming obsolete. I’m not the only one who feels this way as GitHub chose to move from jQuery to no framework at all. Everyone else was jumping into React, and Angular forgetting the lessons we learned from moving from legacy jQuery to the shiny new thing. GitHub believed no framework allowed their website to be more resilient over a longer period. They might be right.
Wrapping Things Up
React is not bad, but it is an artifact that we may no longer need. Facebook built it to solve a very specific problem and I’m sure it’ll work for them for years to come. And it may work for your problem too, but you may consider that you don’t need it. You probably don’t have the same problem they do. Bolting their 2000 pound gorilla to your customer’s custom tool may not solve the problem the best way. Try to keep the websites as simple as possible and go as native as possible.